Outline

• What is an API

• The Google Maps API
  • Version
  • Reference Information
  • Key Components
  • Examples

What is an API

• API Stands for Application Programming Interface

An Application Programming Interface (API) is a particular set of rules and specifications that a software program can follow to access and make use of the services and resources provided by another particular software program that implements that API. It serves as an interface between different software programs and facilitates their interaction, similar to the way the user interface facilitates interaction between humans and computers. -- From Wikipedia: http://en.wikipedia.org/wiki/Api

• The Google Maps API provides an interface for interacting with Google’s mapping services from external web applications

Google Maps API Version

• The version of the Google Maps API used in this class is v3 of the Javascript API
  • Freely usable for free applications
  • Subject to Google’s Terms of Service
  • Google API key is optional for our work
• Key capabilities in v3
  • Interactive maps based on Google’s mapping engine (contrast w. static maps API)
  • Optimized for desktop and mobile platforms and applications

Reference Information

Google Maps API Family

http://code.google.com/apis/maps/

Javascript API Home Page

http://code.google.com/apis/maps/documentation/javascript/

Javascript API v3 Tutorial Page

http://code.google.com/apis/maps/documentation/javascript/tutorial.html

Key Components

• Map object options

Types (required)

ROADMAP

SATELLITE

HYBRID

TERRAIN

Latitude and Longitude (required)

specification of where the map should initially be centered

Zoom Level (required)

0=global, higher values increasingly local. Limited by map type

Controls

• Available Controls (enabled through map options) default controls
  • Zoom Control
  • Pan Control
  • Scale Control
  • MapType Control
  • Street View Control
  • Rotate (for maps that contain 45-degree imagery)
• Different control styles may be defined
• Controls may be positioned positioning options
• Custom controls may be defined and attached to fixed location in the map

Overlays

Overlay Types documentation

Marker

points depicted by specified or defined icons at locations within the map

Polyline

linear features defined by multiple points with a defined style for the line

Polygon

closed features defined by multiple points. Supports multi-polygons, and donuts. Line and fill styles may be specified.

(Ground) Overlay Maps

Image-based map layers that replace or overlay Google layers - registered to the map coordinates

Overlays (continued)

Info Windows

floating content windows for displaying content defined as HTML, a DOM element, or text string

Layers

Grouped display content assigned to a specific layer type: Data (including GeoJSON), KmlLayer (& GeoRSS), Heatmap, FusionTablesLayer, TrafficLayer, TransitLayer BicyclingLayer

Custom Overlays

definition of programmatically controlled layers

Services

• Geocoding Service
  • Forward and reverse geocoding:
    • address to LatLon
    • LatLon to Nearest Address
  • May be biased to current viewport, region
• Directions
  • Based upon an origin, destination, and a variety of additional options
  • Available directions and rendered route
• Distance Matrix
  • Travel distance and duration given a specific mode of travel

Services

• Elevation
  • Delivery of elevation data for locations or paths
• Streetview
  • Integration of Google Streetview within a DOM element
• Maximum Zoom
  • Provides information about the maximum available zoom level

Events

• Events provide the ability to attach custom behaviors to events in the interface. For example:
  • Changing items in the interface as the user zooms in on a map
  • Displaying additional information outside the map when the user clicks a location in the map
  • Synchronizing the behavior of multiple maps as the user interacts with one map
• Requires higher-level Javascript than we will cover in this course

Examples

Simple - Roadmap

Simple - Roadmap Code

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23

<!DOCTYPE html>
<html>
    <head>
        <link rel="stylesheet" type="text/css" href="css/mapPage.css">
    </head>

    <body>
        <h1>Sample Map</h1>
        <div id="map_canvas"></div>

    <!-- Let's put our JavaScript down here --------------------------------------------->
        <!-- Load the external JavaScript file with the map definition code -->
        <script src="js/mapPage_01.js"></script>
        
        <!-- Load the API in asynchronous mode and execute the initialize 
            function when done -->
        <!-- The optional 'key-<API Key>' parameter is not used here but should be 
            for a production map -->
        <script async defer 
            src="https://maps.googleapis.com/maps/api/js?callback=initialize">
        </script>
    </body>
</html>

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21

/* You must set the height of either the 'html' or 'body' elements for some 
    browsers to properly render the map with a hight taller than 0px */
html { 
    height: 100% }

body { 
    height: 100%; 
    margin: 0px; 
    padding: 0px; 
    background-color: black; 
    color: #CCCCCC;
    text-align: center}
    
#map_canvas { 
    width:90%; 
    height:80%; 
    margin-left:auto; 
    margin-right: auto }
    
.infoBox { 
    color:black }

1
2
3
4
5
6
7
8
9
10
11
12

function initialize() {
    var classroom = new google.maps.LatLng(35.084280,-106.624073)
    var mapOptions = {
        zoom: 8,
        center: classroom,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    var map = new google.maps.Map(
        document.getElementById("map_canvas"),
        mapOptions);
}

Simple - Satellite

Simple - Satellite Code

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23

<!DOCTYPE html>
<html>
    <head>
        <link rel="stylesheet" type="text/css" href="css/mapPage.css">
    </head>

    <body>
        <h1>Sample Map</h1>
        <div id="map_canvas"></div>

    <!-- Let's put our JavaScript down here --------------------------------------------->
        <!-- Load the external JavaScript file with the map definition code -->
        <script src="js/mapPage_02.js"></script>
        
        <!-- Load the API in asynchronous mode and execute the initialize 
            function when done -->
        <!-- The optional 'key-<API Key>' parameter is not used here but should be 
            for a production map -->
        <script async defer 
            src="https://maps.googleapis.com/maps/api/js?callback=initialize">
        </script>
    </body>
</html>

1
2
3
4
5
6
7
8
9
10
11
12

function initialize() {
    var classroom = new google.maps.LatLng(35.084280,-106.624073)
    var mapOptions = {
        zoom: 8,
        center: classroom,
        mapTypeId: google.maps.MapTypeId.SATELLITE
    };
    var map = new google.maps.Map(
        document.getElementById("map_canvas"),
        mapOptions);
}

Simple - Hybrid

Simple - Hybrid Code

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23

<!DOCTYPE html>
<html>
    <head>
        <link rel="stylesheet" type="text/css" href="css/mapPage.css">
    </head>

    <body>
        <h1>Sample Map</h1>
        <div id="map_canvas"></div>

    <!-- Let's put our JavaScript down here --------------------------------------------->
        <!-- Load the external JavaScript file with the map definition code -->
        <script src="js/mapPage_03.js"></script>
        
        <!-- Load the API in asynchronous mode and execute the initialize 
            function when done -->
        <!-- The optional 'key-<API Key>' parameter is not used here but should be 
            for a production map -->
        <script async defer 
            src="https://maps.googleapis.com/maps/api/js?callback=initialize">
        </script>
    </body>
</html>

1
2
3
4
5
6
7
8
9
10
11
12

function initialize() {
    var classroom = new google.maps.LatLng(35.084280,-106.624073)
    var mapOptions = {
        zoom: 8,
        center: classroom,
        mapTypeId: google.maps.MapTypeId.HYBRID
    };
    var map = new google.maps.Map(
        document.getElementById("map_canvas"),
        mapOptions);
}

Simple - Terrain

Simple - Terrain Code

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23

<!DOCTYPE html>
<html>
    <head>
        <link rel="stylesheet" type="text/css" href="css/mapPage.css">
    </head>

    <body>
        <h1>Sample Map</h1>
        <div id="map_canvas"></div>

    <!-- Let's put our JavaScript down here --------------------------------------------->
        <!-- Load the external JavaScript file with the map definition code -->
        <script src="js/mapPage_04.js"></script>
        
        <!-- Load the API in asynchronous mode and execute the initialize 
            function when done -->
        <!-- The optional 'key-<API Key>' parameter is not used here but should be 
            for a production map -->
        <script async defer 
            src="https://maps.googleapis.com/maps/api/js?callback=initialize">
        </script>
    </body>
</html>

1
2
3
4
5
6
7
8
9
10
11
12

function initialize() {
    var classroom = new google.maps.LatLng(35.084280,-106.624073)
    var mapOptions = {
        zoom: 8,
        center: classroom,
        mapTypeId: google.maps.MapTypeId.TERRAIN
    };
    var map = new google.maps.Map(
        document.getElementById("map_canvas"),
        mapOptions);
}

Simple - Hybrid - Zoomed

Simple - Hybrid - Zoomed Code

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23

<!DOCTYPE html>
<html>
    <head>
        <link rel="stylesheet" type="text/css" href="css/mapPage.css">
    </head>

    <body>
        <h1>Sample Map</h1>
        <div id="map_canvas"></div>

    <!-- Let's put our JavaScript down here --------------------------------------------->
        <!-- Load the external JavaScript file with the map definition code -->
        <script src="js/mapPage_05.js"></script>
        
        <!-- Load the API in asynchronous mode and execute the initialize 
            function when done -->
        <!-- The optional 'key-<API Key>' parameter is not used here but should be 
            for a production map -->
        <script async defer 
            src="https://maps.googleapis.com/maps/api/js?callback=initialize">
        </script>
    </body>
</html>

1
2
3
4
5
6
7
8
9
10
11
12

function initialize() {
    var classroom = new google.maps.LatLng(35.084280,-106.624073)
    var mapOptions = {
        zoom: 18,
        center: classroom,
        mapTypeId: google.maps.MapTypeId.TERRAIN
    };
    var map = new google.maps.Map(
        document.getElementById("map_canvas"),
        mapOptions);
}

Simple - Zoomed - Modified Controls

Simple - Zoomed - Modified Controls Code

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23

<!DOCTYPE html>
<html>
    <head>
        <link rel="stylesheet" type="text/css" href="css/mapPage.css">
    </head>

    <body>
        <h1>Sample Map</h1>
        <div id="map_canvas"></div>

    <!-- Let's put our JavaScript down here --------------------------------------------->
        <!-- Load the external JavaScript file with the map definition code -->
        <script src="js/mapPage_06.js"></script>
        
        <!-- Load the API in asynchronous mode and execute the initialize 
            function when done -->
        <!-- The optional 'key-<API Key>' parameter is not used here but should be 
            for a production map -->
        <script async defer 
            src="https://maps.googleapis.com/maps/api/js?callback=initialize">
        </script>
    </body>
</html>

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18

function initialize() {
var classroom = new google.maps.LatLng(35.084280,-106.624073)
var myOptions = {
    zoom: 18,
    center: classroom,
    mapTypeId: google.maps.MapTypeId.HYBRID,
    zoomControl: true,
    zoomControlOptions: {style: google.maps.ZoomControlStyle.SMALL},
    mapTypeControl: true,
    mapTypeControlOptions: {
    style: google.maps.MapTypeControlStyle.DROPDOWN_MENU},
    streetViewControl: false
};
var map = new google.maps.Map(
    document.getElementById("map_canvas"),
    myOptions);
}

Markers

Markers Code

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23

<!DOCTYPE html>
<html>
    <head>
        <link rel="stylesheet" type="text/css" href="css/mapPage.css">
    </head>

    <body>
        <h1>Sample Map</h1>
        <div id="map_canvas"></div>

    <!-- Let's put our JavaScript down here --------------------------------------------->
        <!-- Load the external JavaScript file with the map definition code -->
        <script src="js/mapPage_07.js"></script>
        
        <!-- Load the API in asynchronous mode and execute the initialize 
            function when done -->
        <!-- The optional 'key-<API Key>' parameter is not used here but should be 
            for a production map -->
        <script async defer 
            src="https://maps.googleapis.com/maps/api/js?callback=initialize">
        </script>
    </body>
</html>

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25

function initialize() {
    var classroom = new google.maps.LatLng(35.084280,-106.624073)
    var office = new google.maps.LatLng(35.084506,-106.624899)
    var myOptions = {
        zoom: 18,
        center: classroom,
        mapTypeId: google.maps.MapTypeId.HYBRID
        };
    var map = new google.maps.Map(
        document.getElementById("map_canvas"), 
        myOptions);

    var classroomMarker = new google.maps.Marker({
        position: classroom,
        title:"Geography 485L/585L Classroom, Bandelier East, Room 106"
        });
    classroomMarker.setMap(map);

    var officeMarker = new google.maps.Marker({
        position: office,
        title:"Office, Bandelier West, Room 107"
        });
    officeMarker.setMap(map);
}

Polyline

Polyline Code

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23

<!DOCTYPE html>
<html>
    <head>
        <link rel="stylesheet" type="text/css" href="css/mapPage.css">
    </head>

    <body>
        <h1>Sample Map</h1>
        <div id="map_canvas"></div>

    <!-- Let's put our JavaScript down here --------------------------------------------->
        <!-- Load the external JavaScript file with the map definition code -->
        <script src="js/mapPage_08.js"></script>
        
        <!-- Load the API in asynchronous mode and execute the initialize 
            function when done -->
        <!-- The optional 'key-<API Key>' parameter is not used here but should be 
            for a production map -->
        <script async defer 
            src="https://maps.googleapis.com/maps/api/js?callback=initialize">
        </script>
    </body>
</html>

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38

    var classroom = new google.maps.LatLng(35.084280,-106.624073)
    var office = new google.maps.LatLng(35.084506,-106.624899)
    var myOptions = {
        zoom: 18,
        center: classroom,
        mapTypeId: google.maps.MapTypeId.HYBRID
        };
    var map = new google.maps.Map(
        document.getElementById("map_canvas"), 
        myOptions);

    var classroomMarker = new google.maps.Marker({
        position: classroom,
        title:"Geography 485L/585L Classroom, Bandelier East, Room 106"
        });
    classroomMarker.setMap(map);

    var officeMarker = new google.maps.Marker({
        position: office,
        title:"Office, Bandelier West, Room 107"
        });
    officeMarker.setMap(map); 

    var officeVisitCoordinates = [
        office,
        new google.maps.LatLng(35.084445,-106.624327),
        new google.maps.LatLng(35.084309,-106.624308),
        classroom
        ];
    var officePath = new google.maps.Polyline({
        path: officeVisitCoordinates,
        strokeColor: "#FF0000",
        strokeOpacity: 1.0,
        strokeWeight: 2
    });
    officePath.setMap(map)
}

Polygon

Polygon Code

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23

<!DOCTYPE html>
<html>
    <head>
        <link rel="stylesheet" type="text/css" href="css/mapPage.css">
    </head>

    <body>
        <h1>Sample Map</h1>
        <div id="map_canvas"></div>

    <!-- Let's put our JavaScript down here --------------------------------------------->
        <!-- Load the external JavaScript file with the map definition code -->
        <script src="js/mapPage_09.js"></script>
        
        <!-- Load the API in asynchronous mode and execute the initialize 
            function when done -->
        <!-- The optional 'key-<API Key>' parameter is not used here but should be 
            for a production map -->
        <script async defer 
            src="https://maps.googleapis.com/maps/api/js?callback=initialize">
        </script>
    </body>
</html>

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45

function initialize() {
    var classroom = new google.maps.LatLng(35.084280,-106.624073)
    var office = new google.maps.LatLng(35.084506,-106.624899)
    var myOptions = {
        zoom: 18,
        center: classroom,
        mapTypeId: google.maps.MapTypeId.HYBRID
        };
    var map = new google.maps.Map(
        document.getElementById("map_canvas"), 
        myOptions);
    var classroomMarker = new google.maps.Marker({
        position: classroom,
        title:"Geography 485L/585L Classroom, Bandelier East, Room 106"
        });
    classroomMarker.setMap(map);
    var officeMarker = new google.maps.Marker({
        position: office,
        title:"Office, Bandelier West, Room 107"
        });
    officeMarker.setMap(map); 
    var buildingCoordinates = [
        new google.maps.LatLng(35.084498,-106.624921),
        new google.maps.LatLng(35.084558,-106.624911),
        new google.maps.LatLng(35.084566,-106.624970),
        new google.maps.LatLng(35.084609,-106.624966),
        new google.maps.LatLng(35.084544,-106.624383),
        new google.maps.LatLng(35.084438,-106.624317),
        new google.maps.LatLng(35.084384,-106.623922),
        new google.maps.LatLng(35.084164,-106.623970),
        new google.maps.LatLng(35.084214,-106.624324),
        new google.maps.LatLng(35.084214,-106.624324),
        new google.maps.LatLng(35.084391,-106.624284)
        ];
    var bldgPoly = new google.maps.Polygon({
        paths: buildingCoordinates,
        strokeColor: "#FF0000",
        strokeOpacity: 0.8,
        strokeWeight: 2,
        fillColor: "#FF0000",
        fillOpacity: 0.35
    });
    bldgPoly.setMap(map)
}

Adding an Info Window

Adding an Info Window Code

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23

<!DOCTYPE html>
<html>
    <head>
        <link rel="stylesheet" type="text/css" href="css/mapPage.css">
    </head>

    <body>
        <h1>Sample Map</h1>
        <div id="map_canvas"></div>

    <!-- Let's put our JavaScript down here --------------------------------------------->
        <!-- Load the external JavaScript file with the map definition code -->
        <script src="js/mapPage_10.js"></script>
        
        <!-- Load the API in asynchronous mode and execute the initialize 
            function when done -->
        <!-- The optional 'key-<API Key>' parameter is not used here but should be 
            for a production map -->
        <script async defer 
            src="https://maps.googleapis.com/maps/api/js?callback=initialize">
        </script>
    </body>
</html>

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54

function initialize() {
    var classroom = new google.maps.LatLng(35.084280,-106.624073)
    var office = new google.maps.LatLng(35.084506,-106.624899)
    var myOptions = {
        zoom: 18,
        center: classroom,
        mapTypeId: google.maps.MapTypeId.HYBRID
        };
    var map = new google.maps.Map(
        document.getElementById("map_canvas"), 
        myOptions);
    var classroomMarker = new google.maps.Marker({
        position: classroom,
        title:"Geography 485L/585L Classroom, Bandelier East, Room 106"
        });
    classroomMarker.setMap(map);
    var officeMarker = new google.maps.Marker({
        position: office,
        title:"Office, Bandelier West, Room 107"
        });
    officeMarker.setMap(map); 
    var buildingCoordinates = [
        new google.maps.LatLng(35.084498,-106.624921),
        new google.maps.LatLng(35.084558,-106.624911),
        new google.maps.LatLng(35.084566,-106.624970),
        new google.maps.LatLng(35.084609,-106.624966),
        new google.maps.LatLng(35.084544,-106.624383),
        new google.maps.LatLng(35.084438,-106.624317),
        new google.maps.LatLng(35.084384,-106.623922),
        new google.maps.LatLng(35.084164,-106.623970),
        new google.maps.LatLng(35.084214,-106.624324),
        new google.maps.LatLng(35.084214,-106.624324),
        new google.maps.LatLng(35.084391,-106.624284)
        ];
    var bldgPoly = new google.maps.Polygon({
        paths: buildingCoordinates,
        strokeColor: "#FF0000",
        strokeOpacity: 0.8,
        strokeWeight: 2,
        fillColor: "#FF0000",
        fillOpacity: 0.35
        });
    bldgPoly.setMap(map);
    var classInfoContent = '<div class="infoBox">' +
        '<p>This is the location for the Geography 485L/585L class</p>' +
        '</div>'
    var classInfoWindow = new google.maps.InfoWindow({
        content: classInfoContent
        });
    google.maps.event.addListener(classroomMarker, 'click', function() {
        classInfoWindow.open(map,classroomMarker);
        });
}

Overview

• Geographic Information Systems
  • Data Types
  • Coordinate Systems
• Services Oriented Architectures
  • Historic Context
  • Current Model - Network Computing
  • Components
  • Interoperability Standards

Data Types - Vector

• Vector data represent phenomena that are associated with specific bounded locations, typically represented by:
  • Points
  • Lines
  • Polygons
• Vector data include:
  • The geometries that describe the area being referenced, and
  • Attributes associated with that area

For example, a census vector data product might include the geometries that define census tracts and attributes associated with each geometry: population, income, etc.

Data Types - Raster

• Raster data are frequently used to represent values for phenomena that vary continuously across space (e.g. elevation, concentration of air pollutants, depth to ground water, etc. )

• These values are encoded over a regular grid of observation locations with a specified grid spacing - often referred to as the spatial resolution of the dataset (i.e. 10m resolution for a standard USGS Digital Elevation Model product)

• Often parts of data collections that are repeated (i.e. remote sensing data products)

Accessing and Processing Raster and Vector Data - Programmatically

• Two geospatial libraries and their related utility programs provide information about and tools for modifying vector and raster data sets

OGR

vector data access and information

GDAL

raster data access and information

These libraries are the data access and processing foundation for a growing number of open source and commercial mapping systems

Information and documentation: GDAL Home Page | OGR Home Page

Coordinate Systems/Projections

• To convert locations from a 3-dimensional oblate spherical coordinate system (such as is commonly used to represent the surface of the earth) to a 2-dimensional representation in a map, a coordinate transformation must be performed.
• There are a limitless number of potential coordinate transformations possible, and a large number have been named and defined that meet specific cartographic or other requirements

EPSG Codes

• A catalog of numeric codes and associated coordinate transformation parameters is maintained by the International Association of Oil & Gas Producers (OGP) - the successor scientific organization to the European Petroleum Survey Group (EPSG)

• These numeric codes are used by many desktop and online mapping systems to document and represent the coordinate systems of available data and services

• Links to an online version of the registry and downloadable databases of the registry are available from: http://www.epsg.org/Geodetic.html.

Projection Parameters

The parameters that define a map projection may be looked up in a number of online locations:

EPSG registry

Helpful if you already know the EPSG code of the projection you are looking for - http://www.epsg-registry.org/

GeoTIFF Projection List

Helpful if you know the name of one of the broadly used projections - uneven performance of links - http://www.remotesensing.org/geotiff/proj_list/

SpatialReference.org

Decent search tool, includes non-EPSG as well as EPSG projection information, multiple descriptions of projection parameters - http://spatialreference.org/

Network Computing Timeline

• Predecessor to the Internet - ARPANET (1969). Interconnection between UCLA and SRI (Menlo Park)
• Adoption of TCP/IP as next generation protocol for ARPANET (1983)
• NSF commissions construction of NSFNET, also based upon TCP/IP (1983)
• NSFNET opened to commercial connections (1988). Led to interconnection of multiple, previously separate networks into an “Internet”
• Growth of internet users has expanded rapidly over the past decade

In a Phrase ...

The current networking computing model consists of Components Interacting with Each Other

So - We Need to Answer the Following Questions

What are components?

What does it mean to interact?

Key Components - Data

Database systems

• Optimized for storing massive quantities of tabular data
• May be spatially enabled to support the storage of geometries (points, lines, polygons) in addition to related attribute data
• Standard language (Structured Query Language [SQL]) for interacting with many databases
• Broad support for accessing the contents of databases from many other applications and programming languages, for example:
  • Spreadsheets
  • Statistical Software
  • Geographic Information Systems (GIS)

Key Components - Data

File-based data

• Often stored on the file system
• Sometimes difficult represent data within a database structure (i.e. binary data)
• May be in a wide variety of formats
  • XML
  • ASCII Text (e.g. CSV, tab-delimited)
  • Binary files
  • Excel Spreadsheets
  • Word Processing Documents
  • Geospatial data (e.g. imagery)
• Remotely Accessible Data
  • Some data may be provided through reference to an external network resource (i.e. a web address, or other identifier) or service

Key Components - Processing Services

• Perform modification of source data to generate a new data product

• May be “chained” together to create a processing “workflow”. Output from one processing service may be used as the input to another

• May be simple OGC services; or complex data processing, analysis, or visualization services. Examples include
  • Extraction of a subset of a large data set based upon provided search criteria
  • Generation of a map from a collection of data
  • Fusion of two data products into a single derived product (e.g. vegetation indices calculated from multiple remote sensing images)
  • Calculation of statistical information for an input product, and delivery of the statistical summary

Key Components - Clients

• Any system that accesses the services provided by the system may be considered a “client”
• That system may be manually operated by a human user, or triggered automatically by software
• Human operated clients include
  • Web-based applications
  • Desktop applications such as Geographic Information Systems and Statistical Analysis tools
• Machine clients include
  • Data processing services that translate requests to them into requests for other system services
  • Regularly scheduled requests that are automatically triggered by external computer systems.

Open Geospatial Consortium (OGC) Standards

• Two Classes of Standards Considered Here
  • Geospatial Product Access Standards
  • Geospatial Data and Representation Standards
• Product Access Standards
  • Web Map Services (WMS)
  • Web Feature Services (WFS)
  • Web Coverage Services (WCS)
• Data and Representation Standards
  • Geography Markup Language (GML)
  • KML (formerly known as Keyhole Markup Language)

OGC Web Feature Services (WMS) Characteristics

• HTTP GET (required), HTTP POST (optional)
• Requests:
  • GetCapabilities
  • GetMap
  • GetFeatureInfo
• Returns
  • Mapped data
  • XML Capabilities Document, Feature Attributes
• Includes support for time-based requests

OGC Web Feature Services (WFS) Characteristics

• Either HTTP GET or POST required
• Requests
  • GetCapabilities
  • DescribeFeatureType
  • GetFeature/GetFeatureWithLock
  • GetGmlObject
  • LockFeature
  • Transaction
• Returns
  • XML (GML)
  • Capabilities
  • Feature Data

OGC Web Coverage Services (WCS) Characteristics

• Either HTTP GET or POST required
• Requests
  • GetCapabilities
  • DescribeCoverage
  • GetCoverage
• Returns
  • Geospatial data for coverage
  • XML Capabilities
• Includes support for time-based requests

OGC Geography Markup Language (GML)

• GML is an XML grammar for representing geospatial features and their associated attributes
• In its generic form it can encode points, lines, and polygons and their associated attributes
• As an XML schema GML was designed to be extensible by communities of practice for consistent encoding of geographic data more richly than allowed by the generic default model
• GML documents representing large complex geometries can be quite large - therefore slow to transfer over the Internet

OGC KML

• An XML specification that supports the encoding of representation and embedding of geospatial data for use in geospatial viewers
• Began as the underlying representation language of Google Earth (originally developed by Keyhole for their virtual Earth viewer)
• Adopted as an OGC standard in 2008
• Supports data linkage through
  • Embedding
  • Reference through external URLs - with WMS specifically supported through parameterization
• Includes support for the representation of time in relation to data objects

OGC Summary

The OGC web service specifications support key geospatial data access requirements

WMS

visualization of geospatial data through simple web requests

WFS

delivery of geospatial data (typically points, lines, and polygons) in a format that is usable in GIS and other applications

WCS

delivery of geospatial data (typically, but not limited to, raster data) usable in other applications

OGC Summary

The OGC data and representation standards support data exchange and higher level representation

GML

XML schema for the representation of features and associated attributes. It may be extended for use by specific communities of users (i.e. ecological data models)

KML

XML schema that supports the combination of embedded data and external data into a complete representation model that may be used by client applications to present the data through a user interface (e.g. Google Earth, WorldWind)